<template>
  <div class="myOrder">
    <div class="nav-top">
      <!-- <div :class="current === 0 ? 'active' : ''" @click="getGoodsOrder()">
        商品订单
      </div> -->
      <div :class="current === 1 ? 'active' : ''" @click="getTestOrder()">
        课程订单
      </div>
    </div>
    <div>
        <!-- <Goods v-if="current == 0"></Goods> -->
        <Test v-if="current ==1"></Test>
    </div>
  </div>
</template>

<script>
// import Goods from "./Order/goodsOrder.vue";
import Test from "./Order/testOrder.vue";
export default {
  data() {
    return {
      current: 1,
    };
  },
  components: { Test },
  methods: {
    getGoodsOrder() {
      this.current = 0;
    },
    getTestOrder() {
      this.current = 1;
    },
  },
};
</script>

<style lang="scss" scoped>
.myOrder {
  width: calc(1650 / 1920 * 100vw);
  background: #fff;
  position: absolute;
  top: calc(350 / 1920 * 100vw);
  left: calc(240 / 1920 * 100vw);
  padding: calc(10 / 1920 * 100vw) calc(40 / 1920 * 100vw)
    calc(40 / 1920 * 100vw);
  .nav-top {
    display: flex;
    position: absolute;
    top: calc(-40 / 1920 * 100vw);
    left: calc(0 / 1920 * 100vw);
    div {
      width: calc(120 / 1920 * 100vw);
      height: calc(40 / 1920 * 100vw);
      text-align: center;
      line-height: calc(40 / 1920 * 100vw);
    }
    .active {
      background: #fff;
      border-radius: calc(10 / 1920 * 100vw) calc(10 / 1920 * 100vw) 0px 0px;
    }
  }
}
</style>